Plotly Map with Adjustable Slider

Move the cursor from left or right to a desired year. Hover over a country to view CO2 emission data for the corresponding year.

Technical Design

A Plotly map with an adjustable slider was created from our dataset to develop another level of interactivity for users. In addition, hover text was integrated into the map to display country name and CO2 value in metric tons after the user chooses a year on the slider. The darker the red a country appear, the more CO2 emissions are emitted. The years are incremented by 6 years on the slider.

Plotly Map

✔ Pandas
✔ Plotly

The code pictured on the left was created to develop our interactive Plotly map. We introduced a start year of 1850 since data before this time was limited to 1 or 2 countries. For consistency, all of the interactive plots begin at this year. Offline plotting was then introduced with the following function: "plotly.offline.init_notebook_mode()". This allows Plotly graphs to be generated offline and saved locally on a machine. An empty list was then created for "data" to empty a map onto it and its characterisitics. steps". An empty list was also created for "steps" to introduce the slider for the map. A function integrated to develop the year scale for the slider. The layout displays scope and projection to enable viewing of the entire map of the world. Lastly, the figure for our data and layout was called with the iplot function to display the map you see above.